import React, { ReactNode, Suspense, lazy, useEffect } from 'react';
import './App.css';
import './assets/font/normal-font/iconfont'
import type { FC } from 'react';
import locale from 'antd/locale/zh_CN';
import 'nprogress/nprogress.css';
import NProgress from 'nprogress';
import { BrowserRouter, Routes, Route, Link, HashRouter } from 'react-router-dom';
import KeepAlive, { AliveScope, useAliveController } from 'react-activation';
import EditPage from './views/edit-page/EditPage';
import { message } from 'antd';
import 'antd/dist/reset.css';
import './assets/style/com.scss';
import { Provider } from "react-redux";
import { ConfigProvider } from 'antd';
import store from './redux/store';
import { addTodo } from './redux/todo.slice';
import LuckySheetWapper from './views/office-lib/excel-editor/LuckySheetWapper';
import { saasConfig } from './config/theme-config';
const DocGroupPage = lazy(() => import('./views/home-page/doc-group/DocGroupPage'));
const RecentlyOpened = lazy(() => import('./views/home-page/recently-opened/RecentlyOpened'));
const AllProjects = lazy(() => import('./views/home-page/all-projects/AllProjects'));
const ShareFiles = lazy(() => import('./views/home-page/share-files/ShareFiles'));
const RecylingBin = lazy(() => import('./views/home-page/recycling-bin/RecylingBin'));
const StatisticalAnalysis = lazy(() => import('./views/statistical-analysis/StatisticalAnalysis'));
const Login = lazy(() => import('./views/login/Login'));
const LoginYunNan = lazy(() => import('./views/login/LoginYunNan'));
const HomePage = lazy(() => import('./views/home-page/HomePage'));
const Register = lazy(() => import('./views/register/Register'));
const MainLayout = lazy(() => import('./layout/MainLayout'));
import Loadable from 'react-loadable';
import FontStyleYunNan from './views/sass-components/FontStyleYunNan';
import FontStyleQingYuan from './views/sass-components/FontStyleQingYuan';
import { fillLatinNameUtil } from './utils/SDK/fillLatinNameUtils';

const App: FC = () => {

  useEffect(() => {
    const docItemList = [
      {
        type: "text",
        text: "山西芦芽山国家级自然保护区（以下简称“芦芽山保护区”）位于山西省忻州市，晋西北吕梁山脉北端，地处管涔山南麓，宁武县、五寨县、岢岚县交界处。地理坐标为东经111°50′00″~112°5′30″，北纬38°35′40″~38°45′00″。主要保护对象为世界珍禽褐马鸡以及以云杉、华北落叶松为主的天然次生林生态系统。",
        textStyleMap: {},
    },
    {
        type: "text",
        text: "芦芽山保护区内植被丰富，分布着大量的云杉、华北落叶松为主的天然次生林，还有紫点杓兰、大花杓兰等国家二级重点保护野生植物；野生动物资源丰富，又位于国际重要候鸟迁徙通道，主要分布有褐马鸡、金钱豹、原麝等国家一级重点保护野生动物，其中金钱豹被列为我国“十四五”抢救性保护的48种极度濒危野生动物之一，具有重要的保护价值。同时，自然保护区拥有独特的森林生态系统，是汾河的发源地，在保护水环境资源、水禽栖息地、维持生物多样性、涵养水源等方面，具有显著的生态效益，在确保国土安全、提高保护意识、加快社会经济发展等方面，具有良好的社会效益和潜在经济效益。",
        textStyleMap: {},
    },
    {
        type: "text",
        text: "依据国家林业和草原局、农业农村部2021年联合发布的《国家重点保护野生动物名录》以及《山西省重点保护野生动物名录》（2020年）芦芽山保护区分布有我国国家一级重点保护野生动物褐马鸡、金钱豹、原麝、黑鹳等11种；国家二级重点保护野生动物有石貂、黄喉貂、鸳鸯、大天鹅等29种。保护区包含山西省省级重点保护的野生动物13种。",
        textStyleMap: {},
    }
    ]
    const speciesInfoList = [
      {
        "canorical_me": "Ciconia boycia",
        "family": "Ciconiidae",
        "genus": "Ciconia",
        "species_c": "东方白鹳"
    },
    {
        "canorical_me": "Mergus squamatus",
        "family": "Anatidae",
        "genus": "Mergus",
        "species_c": "中华秋沙鸭"
    },
    {
        "canorical_me": "Neofelis nebulosa",
        "family": "Felidae",
        "genus": "Neofelis",
        "species_c": "云豹"
    },
    {
        "canorical_me": "Taxus wallichiana var. mairei",
        "family": "Taxaceae",
        "genus": "Taxus",
        "species_c": "南方红豆杉"
    },
    {
        "canorical_me": "Moschus moschiferus",
        "family": "Moschidae",
        "genus": "Moschus",
        "species_c": "原麝"
    },
    {
        "canorical_me": "Ailuropoda melanoleuca",
        "family": "Ailuropodidae",
        "genus": "Ailuropoda",
        "species_c": "大熊猫"
    },
    {
        "canorical_me": "Rhinopithecus roxella",
        "family": "Cercopithecidae",
        "genus": "Rhinopithecus",
        "species_c": "川金丝猴"
    },
    {
        "canorical_me": "Tetrastes sewerzowi subsp. sewerzowi",
        "family": "Phasianidae",
        "genus": "Tetrastes",
        "species_c": "斑尾榛鸡"
    },
    {
        "canorical_me": "Nipponia nippon",
        "family": "Threskiornithidae",
        "genus": "Nipponia",
        "species_c": "朱鹮"
    },
    {
        "canorical_me": "Moschus berezovskii",
        "family": "Moschidae",
        "genus": "Moschus",
        "species_c": "林麝"
    },
    {
        "canorical_me": "Campanula dasyantha",
        "family": "Campanulaceae",
        "genus": "Campanula",
        "species_c": "毛花风铃草"
    },
    {
        "canorical_me": "Rhinopithecus bieti",
        "family": "Cercopithecidae",
        "genus": "Rhinopithecus",
        "species_c": "滇金丝猴"
    },
    {
        "canorical_me": "Kingdonia uniflora",
        "family": "Circaeasteraceae",
        "genus": "Kingdonia",
        "species_c": "独叶草"
    },
    {
        "canorical_me": "Haliaeetus leucoryphus",
        "family": "Accipitridae",
        "genus": "Haliaeetus",
        "species_c": "玉带海雕"
    },
    {
        "canorical_me": "Davidia involucrata",
        "family": "Nyssaceae",
        "genus": "Davidia",
        "species_c": "珙桐"
    },
    {
        "canorical_me": "Haliaeetus albicilla",
        "family": "Accipitridae",
        "genus": "Haliaeetus",
        "species_c": "白尾海雕"
    },
    {
        "canorical_me": "Aquila heliaca",
        "family": "Accipitridae",
        "genus": "Aquila",
        "species_c": "白肩雕"
    },
    {
        "canorical_me": "Taxus wallichiana var. chinensis",
        "family": "Taxaceae",
        "genus": "Taxus",
        "species_c": "红豆杉"
    },
    {
        "canorical_me": "Lophophorus lhuysii",
        "family": "Phasianidae",
        "genus": "Lophophorus",
        "species_c": "绿尾虹雉"
    },
    {
        "canorical_me": "Cyanthus formosus",
        "family": "Campanulaceae",
        "genus": "Cyanthus",
        "species_c": "美丽蓝钟花"
    },
    {
        "canorical_me": "Gypaetus barbatus",
        "family": "Accipitridae",
        "genus": "Gypaetus",
        "species_c": "胡兀鹫"
    },
    {
        "canorical_me": "Crossoptilon mantchuricum",
        "family": "Phasianidae",
        "genus": "Crossoptilon",
        "species_c": "褐马鸡"
    },
    {
        "canorical_me": "Codonopsis javanica",
        "family": "Campanulaceae",
        "genus": "Codonopsis",
        "species_c": "金钱豹"
    },
    {
        "canorical_me": "Aquila chrysaetos subsp. kamtschatica",
        "family": "Accipitridae",
        "genus": "Aquila",
        "species_c": "金雕"
    },
    {
        "canorical_me": "Uncia uncia",
        "family": "Felidae",
        "genus": "Uncia",
        "species_c": "雪豹"
    },
    {
        "canorical_me": "Moschus chrysogaster",
        "family": "Moschidae",
        "genus": "Moschus",
        "species_c": "马麝"
    },
    {
        "canorical_me": "Grus nigricollis",
        "family": "Gruidae",
        "genus": "Grus",
        "species_c": "黑颈鹤"
    },
    {
        "canorical_me": "Ciconia nigra",
        "family": "Ciconiidae",
        "genus": "Ciconia",
        "species_c": "黑鹳"
    },
    {
        "canorical_me": "Rhinopithecus brelichi",
        "family": "Cercopithecidae",
        "genus": "Rhinopithecus",
        "species_c": "黔金丝猴"
    }
    ];
    //@ts-ignore
    console.log("fillLatinNameUtil--->", fillLatinNameUtil(docItemList, speciesInfoList))
    message.config({
      top: 27,
    });
    localStorage.removeItem('confirmedToChangeSystemParagraph');
    return () => {
    }
  }, [])

  const LoadingProgress: FC = () => {
    useEffect(() => {
      NProgress.start();
      return () => {
        NProgress.done();
      }
    })
    return (
      <div></div>
    )
  };

  const lazyLoadRouteEl = (chilren: ReactNode) => {
    return (<Suspense
      fallback={
        <LoadingProgress />
      }>
      {chilren}
    </Suspense>)
  }

  const dispatchLoginPage = () => {
    switch (saasConfig.systemType) {
      case 'QingYuanDefault':
        return <Login />
        break;
      case 'YunNanLinGuiYuan':
        return <LoginYunNan />
        break;
    }
  }

  const LoadableComponent = () => {
    if (process.env.NODE_ENV === 'development') {
      return lazyLoadRouteEl(<FontStyleYunNan />);
    } else {
      return lazyLoadRouteEl(<FontStyleQingYuan />);
    }
  };

  return (
    <div className="App app-outer-container">
      <Provider store={store}>
        <ConfigProvider
          theme={{
            token: {
              colorPrimary: saasConfig.colorConfig.colorPrimary,
            },
            components: {
              Button: {
                colorPrimary: saasConfig.colorConfig.colorPrimary,
                colorPrimaryBg: saasConfig.colorConfig.colorPrimary,
              }
            }
          }}
          locale={locale}
        >
          <AliveScope>
            <BrowserRouter>
              <LoadableComponent />
              <Routes>
                <Route path='/' element={lazyLoadRouteEl(<MainLayout />)}>
                  <Route path="home" element={lazyLoadRouteEl(<HomePage />)}>
                    <Route path="recently-opened" element={lazyLoadRouteEl(<RecentlyOpened />)}></Route>
                    <Route path="all-projects" element={lazyLoadRouteEl(<AllProjects />)}></Route>
                    <Route path="share-files" element={lazyLoadRouteEl(<ShareFiles />)}></Route>
                    <Route path="recycling-bin" element={lazyLoadRouteEl(<RecylingBin />)}></Route>
                    <Route path="doc-group" element={lazyLoadRouteEl(<DocGroupPage />)}></Route>
                  </Route>
                  <Route path="statistical-analysis" element={lazyLoadRouteEl(<StatisticalAnalysis />)}></Route>
                </Route>
                <Route path="/login" element={lazyLoadRouteEl(dispatchLoginPage())} />
                <Route path="/register" element={lazyLoadRouteEl(<Register />)} />
                <Route path="/edit" element={<EditPage />} />
              </Routes>
            </BrowserRouter>
          </AliveScope>
        </ConfigProvider>
      </Provider>
    </div>
  );
}

export default App;
